<div class="alain-default__content-title">
  <h1>
    G2 自定义图表
    <small>Welcome !</small>
  </h1>
</div>
<div nz-row nzGutter="16">

  <div class="mb-md" nz-col nzMd="8" nzSm="8" nzXs="24">
    <linebar [colorsMap]="colorMap" [data]="data1" [height]="200" [title]="'一种方案 - 柱状图'" showtype="bar"></linebar>
  </div>
  <div class="mb-md" nz-col nzMd="8" nzSm="8" nzXs="24">
    <linebar [colorsMap]="colorMap" [data]="data1" [height]="200" [title]="'一种方案 - 折线图'" showtype="line"></linebar>
  </div>
  <div class="mb-md" nz-col nzMd="8" nzSm="8" nzXs="24">
    <linebar [colorsMap]="colorMap" [data]="data1" [height]="200" [title]="'一种方案 - linebar'" showtype="linebar"></linebar>
  </div>

  <div class="mb-md" nz-col nzMd="8" nzSm="8" nzXs="24">
    <linebar [colorsMap]="colorMap" [data]="data2" [height]="200" [title]="'二种方案 - 柱状图'" showtype="bar"></linebar>
  </div>
  <div class="mb-md" nz-col nzMd="8" nzSm="8" nzXs="24">
    <linebar [colorsMap]="colorMap" [data]="data2" [height]="200" [title]="'二种方案 - 折线图'" showtype="line"></linebar>
  </div>
  <div class="mb-md" nz-col nzMd="8" nzSm="8" nzXs="24">
    <linebar [colorsMap]="colorMap" [data]="data2" [height]="200" [title]="'二种方案 - linebar'" showtype="linebar"></linebar>
  </div>

  <div class="mb-md" nz-col nzMd="12" nzSm="12" nzXs="24">
    <linebar [colorsMap]="colorMap" [data]="data3" [height]="200" [title]="'三种方案 - 柱状图'" showtype="bar"></linebar>
  </div>
  <div class="mb-md" nz-col nzMd="12" nzSm="12" nzXs="24">
    <linebar [colorsMap]="colorMap" [data]="data3" [height]="200" [title]="'三种方案 - 折线图'" showtype="line"></linebar>
  </div>

  <div class="mb-md" nz-col nzMd="12" nzSm="12" nzXs="24">
    <linebar [colorsMap]="colorMap" [data]="data4" [height]="200" [title]="'四种方案 - 柱状图'" showtype="bar"></linebar>
  </div>
  <div class="mb-md" nz-col nzMd="12" nzSm="12" nzXs="24">
    <linebar [colorsMap]="colorMap" [data]="data4" [height]="200" [title]="'四种方案 - 折线图'" showtype="line"></linebar>
  </div>
</div>
